<template>
	<div>
		<div class="item-box" v-for="item of listData" :key="item.id">
			<mu-list textline="two-line">
				<mu-list-item avatar :ripple="false" button>
					<mu-list-item-content>
						<mu-list-item-title>{{item.list_title}}</mu-list-item-title>
						<mu-list-item-sub-title style="color: rgba(0, 0, 0, .87)">{{item.list_user}}</mu-list-item-sub-title>
							<mu-list-item-sub-title>
							{{item.list_info}}
							</mu-list-item-sub-title>
					</mu-list-item-content>
					<mu-list-item-action >
						<mu-list-item-after-text>{{item.list_comm}}</mu-list-item-after-text>
						<mu-checkbox color="yellow700" value="value1" uncheck-icon="star_border" checked-icon="star"></mu-checkbox>
					</mu-list-item-action>
				</mu-list-item>
			</mu-list>
			<mu-divider></mu-divider>
		</div>
	</div>
</template>

<script>
	export default {
		name: 'home-list',
		props: {
			listData: Array
		}
	}
</script>

<style lang="stylus" scoped>
	.item-box:last-child
		margin-bottom:76px
</style>
